<template>
  <div class="zl-dev">
      <!-- {{json}} -->
    <!-- <DevPreviewVue class="ceshi" :item="json"></DevPreviewVue> -->
    <zlDemo class="ceshi" :item="json">aa</zlDemo>
    <Attribute class="text-json" :list="json"></Attribute>
  </div>
</template>

<script>
import zlDemo from '../packages/zlDemo'
import Attribute from './components/Attribute.vue'
import json from 'static/json/test.json'
export default {
    name: 'App',
    components: {
        zlDemo,
        Attribute
    },
    data() {
        return {
            json: json
        }
    },
    mounted() {
        console.log('+++', json)
    }
}
</script>

<style lang="less">
@import '~@/assets/css/reset.css';
#app {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  .zl-dev {
      display: flex;
    width: 100%;
    height: 100%;
    overflow: hidden;
    .ceshi {
        width: 800px;
    }
    .text-json {
        flex: 1 1 auto;
    }
  }
}
</style>
